<bit-section *ngIf="sends?.length > 0" disableMargin>
  <bit-section-header>
    <h2 class="tw-font-bold" bitTypography="h6">
      {{ headerText }}
    </h2>
    <span bitTypography="body1" slot="end">{{ sends.length }}</span>
  </bit-section-header>
  <bit-item-group>
    <bit-item *ngFor="let send of sends">
      <button
        bit-item-content
        appA11yTitle="{{ 'edit' | i18n }} - {{ send.name }}"
        routerLink="/edit-send"
        [queryParams]="{ sendId: send.id, type: send.type }"
        appStopClick
        type="button"
      >
        <div slot="start" class="tw-justify-start">
          <i
            *ngIf="send.type === sendType.Text"
            class="bwi bwi-lg bwi-file-text tw-text-muted tw-w-6"
          ></i>
          <i
            *ngIf="send.type === sendType.File"
            class="bwi bwi-lg bwi-file tw-text-muted tw-w-6"
          ></i>
        </div>
        {{ send.name }}
        <ng-container *ngIf="send.maxAccessCountReached">
          <i
            class="bwi bwi-exclamation-triangle"
            appStopProp
            title="{{ 'maxAccessCountReached' | i18n }}"
            aria-hidden="true"
          ></i>
          <span class="tw-sr-only">{{ "maxAccessCountReached" | i18n }}</span>
        </ng-container>

        <span slot="secondary">
          {{ "deletionDate" | i18n }}:&nbsp;{{ send.deletionDate | date: "mediumDate" }}
        </span>
      </button>
      <ng-container slot="end">
        <bit-item-action>
          <button
            class="tw-p-1"
            bitIconButton="bwi-clone"
            size="small"
            type="button"
            (click)="copySendLink(send)"
            appA11yTitle="{{ 'copyLink' | i18n }} - {{ send.name }}"
          ></button>
        </bit-item-action>
        <bit-item-action>
          <button
            bitIconButton="bwi-trash"
            size="small"
            type="button"
            (click)="deleteSend(send)"
            appA11yTitle="{{ 'delete' | i18n }} - {{ send.name }}"
          ></button>
        </bit-item-action>
      </ng-container>
    </bit-item>
  </bit-item-group>
</bit-section>
